<template>
  <div class="flex items-center justify-center h-screen bg-emerald-50">
    <Card v-if="changePassword===false" class="shadow-xl" style="width: 400px;height: 300px" :bordered="false"
          dis-hover>
      <p class="text-xl text-weight">管理后台</p>
      <p>欢迎您，请登录</p>
      <div class="mt-3">
        <Input class="mt-3" v-model="username" placeholder="请输入工号" style="width: 300px"></Input>
        <Input class="mt-3 mb-3" v-model="password" placeholder="请输入密码" type="password" style="width: 300px"
               clearable></Input>
      </div>
      <div>
        <Button class="w-20" type="primary" @click="Login()">登录</Button>

      </div>
      <div class="mt-3">
        <Button type="info" @click="switchLayout">修改密码</Button>
      </div>
    </Card>
    <Card v-else class="shadow-xl" style="width: 400px;height: 300px" :bordered="false" dis-hover>
      <p class="text-xl text-weight">密码修改</p>
      <div class="mt-3">
        <Input class="mt-3" v-model="username" placeholder="请输入工号" style="width: 300px"></Input>
        <Input class="mt-3 mb-3" v-model="oldPassword" placeholder="请输入旧密码" type="password" style="width: 300px"
               clearable></Input>
        <Input class="mt-3 mb-3" v-model="newPassword" placeholder="请输入新密码" type="password" style="width: 300px"
               clearable></Input>
      </div>
      <div>
        <Button class="w-20" type="primary" @click="change">修改</Button>
      </div>
      <div class="mt-3">
        <Button class="w-20" type="info" @click="switchLayout">返回</Button>
      </div>


    </Card>
  </div>
</template>
<script>
import {login, passwordChange} from "@/api/admin/admin";


export default {
  name: 'Login',
  data() {
    return {
      username: '201806070428',
      password: '123546',
      oldPassword: '',
      newPassword: '',
      changePassword: false
    }
  },
  methods: {
    Login() {
      let formData = new FormData()
      formData.append('username', this.username)
      formData.append('password', this.password)
      login(formData).then(res => {
        let data = res.data
        if (data.code === 200) {
          this.$Message.success('登录成功')
          localStorage.setItem('info', JSON.stringify(data.data))
          if (data.data.role === 'superadmin') {
            this.$router.push({path: '/admin'})
          } else {
            this.$router.push({path: '/Index'})
          }
        } else {
          this.$Message.error(data.message)
        }
      })
    },
    switchLayout() {
      this.changePassword = !this.changePassword
    },
    change() {
      let formData = new FormData()
      formData.append('user_id', this.username)
      formData.append('oldPassword', this.oldPassword)
      formData.append('newPassword', this.newPassword)
      passwordChange(formData).then(res => {
        let data = res.data
        if (data.code === 200) {
          this.$Message.success('修改成功')
        } else {
          this.$Message.error(data.message)
        }

      })
    }
  },
  created() {

  }
}
</script>

<style scoped>
</style>